<template>
  <div class="bg-white rounded-8px">
    <div class="p-30px text-24px font-600 rounded-8px">标准法规库</div>
  </div>
  <div class="bg-white rounded-8px mt-10px">
    <div class=" p-30px">
      <block v-for="(item,index) in lawList">
        <div class="mb-20px">
          <div class="text-center mb-15px"><span class="bg-gray-50 p-10px text-gray-500">{{item.published_time}}</span></div>
          <div class="bg-gray-50 p-10px text-gray-500 p-20px">
            <div class="text-18px text-dark-500 font-weight-600 mb-10px flex linkText" @click="$router.push({name:'lawDetail',query:{id:item.id}})">
              <div class="text-red-300 self-center ml-10px"><el-icon :size="25"><List /></el-icon></div>
              <div class="self-center">{{item.post_title}}</div>
            </div>
            <div class="ml-30px">
              {{ item.post_excerpt }} <span class="text-red-500 linkText"  @click="$router.push({name:'lawDetail',query:{id:item.id}})">查看详情&gt;</span>
            </div>
            
          </div>
        </div>
      </block>
    </div>
  </div>
  
</template>

<script setup>
  import { ref,onMounted,computed,watch, nextTick } from 'vue'
  import { useRoute,useRouter } from 'vue-router'
  import { systemApi,userApi,httpApi } from '../../api/api'
  import { configStore } from '../../stores/config'
  import { Minus } from '@element-plus/icons-vue';
  import DOMPurify from 'dompurify';
  import { ElMessage } from 'element-plus';

  const config = configStore();
  //const lessonData = ref({});
  const router = useRouter()
  const lawList = ref([])

  const init = async() => {

    let res = await httpApi.getStatuteList()
    if(res.code){
      lawList.value = res.data
      console.log("法规列表",lawList.value)
    }


  }

  onMounted(()=>{
    init()
  })

</script>
<style scoped>
  .linkText{cursor: pointer;}
</style>